<template>
  <div id="app">
  <keep-alive include="home">
      <router-view />
  </keep-alive>
    <van-tabbar
      v-model="active"
      active-color="#02a19c"
      inactive-color="#000"
      v-if="$route.meta.isNav == true"
    >
      <van-tabbar-item replace to="/" icon="home-o">首页</van-tabbar-item>
      <van-tabbar-item replace to="/car" icon="shopping-cart-o"
        >购物车</van-tabbar-item
      >
      <van-tabbar-item replace to="/my" icon="manager-o">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>
<script>
export default {
  watch: {
    $route(a) {
      if (a.name == "home") {
        this.active = 0;
      } else if (a.name == "car") {
        this.active = 1;
      } else if (a.name == "my") {
        this.active = 2;
      }
    },
  },
  data() {
    return {
      active: 0,
    };
  },
};
</script>
<style lang="less">
#app {
  font-size: 28px;
}
</style>
